* {
  padding: 0;
  margin: auto;
}
html,
body {
  height: 100%;
  width: 100%;
}
#Top {
  width: 100%;
  height: 70px;
  background-color: black;
}
#Toptext {
  width: 100%;
  height: 200px;
  background-image: url("http://i.gtimg.cn/qqlive/images/20170515/rank_bg.jpg");
}
#Toptext h1 {
  position: relative;
  top: 12%;
}
#Toptext p {
  position: relative;
  top: 20%;
}
#allContain {
  border-radius: 40px;
  width: 100%;
}
#allContain p {
  margin-left: 5%;
  width: 90%;
}
#allContain p .bottomText {
  font-size: 1.1em;
  color: black;
}
#allContain #containtext {
  z-index: 444;
  width: 70%;
  margin-left: 15%;
}
#allContain #containtext ul {
  margin-top: 0.5%;
  width: 100%;
  height: 50px;
  padding: 0;
  margin: auto;
  list-style: none;
}
#allContain #containtext ul li {
  color: #666;
  float: left;
  width: 12.5%;
  text-align: center;
  position: relative;
  top: 20%;
}
#allContain #containtext ul li:hover {
  color: #ff5c38;
}
#containDetailed {
  margin-top: 1.5%;
  width: 100%;
  height: 100%;
}
#containDetailed div {
  border-radius: 10px;
}
#containDetailed div div div {
  margin-left: 2%;
  width: 100% ;
  height: 25%;
}
#containDetailed #div:hover {
  background-color: #f6f6f6;
  transform: all 0.5s;
}
